<!DOCTYPE html>
<html>

	<head>
		<style type="text/css">
			.outdiv {
				border: while 1px solid;
				padding: 8% 120px;
				border-radius: 15px;
			}
			
			.title {
				margin-bottom: 30px;
				font-size: 2em;
				border-bottom: 1px solid white;
				padding: 25px;
			}
			
			button {
				width: 8em;
			}
		</style>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" type="text/css" href="../../layui/css/layui.css" />
	</head>

	<body>
		<div class="outdiv">
			<div class="title">
				删除商品
			</div>
			<div class="layui-form-item layui-form-pane">
				<label class="layui-form-label">请输入ID</label>
				<div class="layui-input-block">
					<input id="id" type="text" name="id" lay-verify="title" autocomplete="off" placeholder="请输入要删除的商品ID" class="layui-input">
				</div>
			</div>
			<div class="layui-input-block">
				<button id="ctlBtn" style="margin-top: 60px;" class="layui-btn" lay-submit lay-filter="formDemo">确认</button>
			</div>

		</div>
	</body>
	<script src="../../js/jquery-2.0.0.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="../../layer-v3.1.1/layer/layer.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		$("#ctlBtn").on("click", function() {
			var data = $("#id").serialize();
			var row =0;
			$.ajax({
				type: "post",
				url: "/Second_Project/deletebook",
				async: true,
				data: data,
				success: function suce(row) {
					layer.open({
						title: '删除成功',
						content: '删除了'+row+'行数据'
					});

				},
				error: function error() {
					layer.msg('输入有误请重新输入');
					$("#id").focus();
				}
			});
		})
	</script>

</html>